﻿<%@ Page Title="" Language="C#" MasterPageFile="~/ECGSite.Master" AutoEventWireup="true" CodeBehind="UserManagePage.aspx.cs" Inherits="ECGWeb.WebForm3" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="childContent" runat="server">
    <script src="Scripts/jquery-1.7.2.js" type="text/javascript"></script>
    <script src="Scripts/json2.js" type="text/javascript"></script>
    <script src="Scripts/contentSlideToggle.js" type="text/javascript"></script>
    <link href="Style/PageStyle.css" rel="stylesheet" type="text/css" />
    <link href="Style/TableStyle.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
        //Hiệu ứng khi click vào đầu các thẻ
        $(document).ready(function () {
            jQuery(".div_head").click(function () {                
                if (jQuery(this).html() == "Thêm mới") {
                    if (jQuery("#addNewDiv").is(":visible")) {
                        jQuery("#addNewDiv").slideToggle(300);
                    }
                    else {
                        jQuery("#addNewDiv").slideToggle(800);
                        if (jQuery("#editDiv").is(":visible"))
                            jQuery("#editDiv").slideToggle(500);
                    }
                }
                else if (jQuery(this).html() == "Chỉnh sửa") {
                    if (jQuery("#editDiv").is(":visible")) {
                        jQuery("#editDiv").slideToggle(300);
                    }
                    else {
                        jQuery("#editDiv").slideToggle(800);
                        if (jQuery("#addNewDiv").is(":visible"))
                            jQuery("#addNewDiv").slideToggle(500);
                    }
                }
                else
                    jQuery(this).next(".horizon_line").next(".div_content").slideToggle(500);
            });
        });

        //Hiệu ứng khi bấm nút edit
        jQuery(".editBtn").live("click", (function () {

            if (jQuery("#addNewDiv").is(":visible")) {
                jQuery("#addNewDiv").slideToggle(300);
                if (!jQuery("#editDiv").is(":visible"))
                    jQuery("#editDiv").slideToggle(800);
                else {
                    jQuery("#editDiv").slideToggle(100);
                    jQuery("#editDiv").slideToggle(800);
                }
            }
            else {
                //                if (!jQuery("#editDiv").is(":visible"))
                //                    jQuery("#editDiv").slideToggle(800);
                //                else {
                //                    jQuery("#editDiv").slideToggle(100);
                //                    jQuery("#editDiv").slideToggle(800);
                //                }
                if (!$("#editDiv").is(":visible")) {                    
                }
            }

            $('html, body').animate({
                scrollTop: $("#userlisthead").offset().top
            }, 1000);
        }));

        //Đổi màu nút bấm menu
        $(window).load(function () {
            $('#tc_userManagementPage').css({ 'background-color': '#6BBBE5' });
        });

        function loadUserToEdit(username) {
            PageMethods.loadUserData(username, OnSuccessLoadData);
        }

        function OnSuccessLoadData(response) {
            var result = response;
            var arr = result.split("|");

            document.getElementById('<%=username_txtbox2.ClientID%>').value = arr[0];
            document.getElementById('<%=pwd_txtbox2.ClientID%>').value = arr[1];
            document.getElementById('<%=repwd_txtbox2.ClientID%>').value = arr[1];
            var permissionDDL = document.getElementById('<%=permissionDDL2.ClientID%>');
            for (var i = 0; i < permissionDDL.options.length; i++) {
                if (permissionDDL[i].text == arr[2]) {
                    permissionDDL.selectedIndex = i;
                    break;
                }
            }
            var realIDDDL = document.getElementById('<%=realidDDL2.ClientID%>');
            for (var i = 0; i < realIDDDL.options.length; i++) {
                if (realIDDDL[i].text == arr[3]) {
                    realIDDDL.selectedIndex = i;
                    break;
                }
            }
        }

        var usernameValidator = false;
        var pwdValidator = false;
        var repwdValidator = false;
        var pwdValidator2 = true;
        var repwdValidator2 = true;

        $(document).ready(function () {
            $("input#pwd_txtbox").change(function () {
                var length = $("#pwd_txtbox").val().length;
                if (length < 6) {
                    $("#pwdValidatorLbl").text("Mật khẩu quá ngắn! Vui lòng nhập mật khẩu lớn hơn 6 kí tự");
                    pwdValidator = false;
                }
                else {
                    $("#pwdValidatorLbl").text("");
                    pwdValidator = true;
                }
            });

            $("input#repwd_txtbox").change(function () {
                var repwd = $("#repwd_txtbox").val();
                var pwd = $("#pwd_txtbox").val();
                if (repwd.toString() != pwd.toString()) {
                    $("#repwdValidatorLbl").text("Mật khẩu không khớp");
                    repwdValidator = false;
                }
                else {
                    $("#repwdValidatorLbl").text("");
                    repwdValidator = true;
                }
            });

            $("input#pwd_txtbox2").change(function () {
                var length = $("#pwd_txtbox2").val().length;
                if (length < 6) {
                    $("#pwdValidatorLbl2").text("Mật khẩu quá ngắn! Vui lòng nhập mật khẩu lớn hơn 6 kí tự");
                    pwdValidator2 = false;
                }
                else {
                    $("#pwdValidatorLbl2").text("");
                    pwdValidator2 = true;
                }
            });

            $("input#repwd_txtbox2").change(function () {
                var repwd = $("#repwd_txtbox2").val();
                var pwd = $("#pwd_txtbox2").val();
                if (repwd.toString() != pwd.toString()) {
                    $("#repwdValidatorLbl2").text("Mật khẩu không khớp");
                    repwdValidator2 = false;
                }
                else {
                    $("#repwdValidatorLbl2").text("");
                    repwdValidator2 = true;
                }
            });

            $("input#username_txtbox").change(function () {
                $.ajax({
                    type: "POST",
                    url: "UserManagePage.aspx/checkUser",
                    //data: '{ "username":"' + $("#username_txtbox").val().toString() + '"}',
                    data: JSON.stringify({ username: $("#username_txtbox").val() }),
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: onSuccessUsername,
                    error: onErrorUsername
                });
            });

            function onSuccessUsername(result) {
                if (result.d == 1) {
                    $("#userNameValidatorLbl").text("Đã tồn tại tài khoản này");
                    usernameValidator = false;
                }
                else {
                    $("#userNameValidatorLbl").text("");
                    usernameValidator = true;
                }
            }

            function onErrorUsername(result) {
                alert('error');
            }

//            $("#addBtn").click(function () {
//                if (usernameValidator && pwdValidator && repwdValidator) {
//                    $.ajax({
//                        type: "POST",
//                        url: "UserManagePage.aspx/addNewUser",
//                        data: JSON.stringify({ username: $("#username_txtbox").val(), pwd: $("#pwd_txtbox").val(), permission: $("#permissionDDL option:selected").text(), realID: $("#realidDDL option:selected").text() }),
//                        contentType: "application/json; charset=utf-8",
//                        dataType: "json",
//                        success: onAddNewSuccess,
//                        error: onAddNewError
//                    });
//                    $("#buttonAddValidator").text("");
//                }
//                else {
//                    $("#buttonAddValidator").text("Bạn cần sửa hết những ô có lỗi hoặc chưa điền");
//                }
//            });

//            $("#editBtn").click(function () {
//                if (pwdValidator2 && repwdValidator2) {
//                    $.ajax({
//                        type: "POST",
//                        url: "UserManagePage.aspx/editUser",
//                        data: JSON.stringify({ username: $("#username_txtbox2").val(), pwd: $("#pwd_txtbox2").val(), permission: $("#permissionDDL2 option:selected").text(), realID: $("#realidDDL2 option:selected").text() }),
//                        contentType: "application/json; charset=utf-8",
//                        dataType: "json",
//                        success: onEditSuccess,
//                        error: onEditError
//                    });
//                    $("#buttonEditValidator").text("");
//                }
//                else {
//                    $("#buttonEditValidator").text("Bạn cần sửa hết những ô có lỗi hoặc chưa điền");
//                }
//            });
        });

        function addNew() {            
            if (usernameValidator && pwdValidator && repwdValidator) {
                PageMethods.addNewUser($("#username_txtbox").val(), $("#pwd_txtbox").val(),
                    $("#permissionDDL option:selected").text(), $("#realidDDL option:selected").text(), onAddNewSuccess);
                $("#buttonAddValidator").text("");
            }
            else {
                $("#buttonAddValidator").text("Bạn cần sửa hết những ô có lỗi hoặc chưa điền");
            }
        }

        function edit() {
            if (pwdValidator2 && repwdValidator2) {
                PageMethods.editUser($("#username_txtbox2").val(), $("#pwd_txtbox2").val(),
                    $("#permissionDDL2 option:selected").text(), $("#realidDDL2 option:selected").text(), onEditSuccess);
                $("#buttonEditValidator").text("");
            }
            else {
                $("#buttonEditValidator").text("Bạn cần sửa hết những ô có lỗi hoặc chưa điền");
            }
        }

        function onEditSuccess(result) {
            if (result == "true") {
                alert("Chỉnh sửa thành công");
                __doPostBack("gridview1", "");
            }
            else
                alert("Chỉnh sửa thất bại! Vui lòng thử lại");
        }

        function onEditError(result) {
            alert('Error');
        }

        function onAddNewSuccess(result) {
            if (result == "true") {
                alert("Thêm mới thành công");
                __doPostBack("gridview1", "");
            }
            else
                alert("Thêm mới thất bại! Vui lòng thử lại");
        }

        function onAddNewError(result) {
            alert('Error');
        }

        function deleteUser(username) {
            if (confirm("Bạn có muốn xóa người dùng có username: " + username))
                PageMethods.deleteUser(username, onSuccessDelete);                                        
        }

        function onSuccessDelete(response) {
            if (response == "true") {
                alert("Xóa thành công");
                __doPostBack("gridview1", "");
            }
            else
                alert("Xóa không thành công! Vui lòng thử lại");
        }
    </script>
    <div class="item">
        <div class="div_head" id="userlisthead">Danh sách người dùng</div>
        <hr noshade size=4 class="horizon_line" />
        <div class="div_content">
            <asp:UpdatePanel ID="updatePanel1" runat="server">
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="gridview1" EventName="pageindexchanging" />
                </Triggers>
                <ContentTemplate>
                    <asp:GridView ID="gridview1" runat="server" AllowPaging="true" ClientIDMode="Static"
                    AllowSorting="true" CssClass="GridViewStyle" GridLines="None"
                    PageSize=5 AutoGenerateColumns="false" 
                        onpageindexchanging="gridview1_PageIndexChanging">
                        <Columns>
                            <asp:BoundField DataField="Username" HeaderText="Username" />
                            <asp:BoundField DataField="Permission" HeaderText="Permission" />
                            <asp:BoundField DataField="RealID" HeaderText="Real ID" />
                            <asp:TemplateField>
                                <ItemTemplate>
                                    <input class="editBtn" type="button" value="Edit" onclick="loadUserToEdit('<%# Eval("Username") %>')"/>                                    
                                </ItemTemplate>
                            </asp:TemplateField>
                            <asp:TemplateField>
                                <ItemTemplate>
                                    <input class="deleteBtn" type="button" value="Delete" onclick="deleteUser('<%# Eval("Username") %>')" />
                                </ItemTemplate>
                            </asp:TemplateField>
                        </Columns>
                        <RowStyle CssClass="RowStyle" />
                        <EmptyDataRowStyle CssClass="EmptyRowStyle" />
                        <PagerStyle CssClass="PagerStyle" />
                        <SelectedRowStyle CssClass="SelectedRowStyle" />
                        <HeaderStyle CssClass="HeaderStyle" />
                        <EditRowStyle CssClass="EditRowStyle" />
                        <AlternatingRowStyle CssClass="AltRowStyle" />
                    </asp:GridView>                    
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </div>
    <div class="item">
        <div class="div_head">Thêm mới</div>
        <hr noshade size=4 class="horizon_line" />
        <div class="div_content" id="addNewDiv">
        <asp:UpdatePanel ID="updatePanel2" runat="server" UpdateMode="Conditional">            
            <ContentTemplate>
                <table cellpadding="0px" cellspacing="0px">
                    <tr>
                        <td align="right" width="130px">
                            Username:
                        </td>
                        <td align="left">
                            <asp:TextBox ClientIDMode="Static" ID="username_txtbox" runat="server" Width="230px"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">                                                
                            <label id="userNameValidatorLbl" class="notifier"></label>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                            Password:
                        </td>
                        <td align="left">
                            <asp:TextBox ClientIDMode="Static" ID="pwd_txtbox" runat="server" Width="230px" TextMode="Password"></asp:TextBox>                            
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">                            
                            <label id="pwdValidatorLbl" class="notifier"></label>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                            Retype Password:
                        </td>
                        <td align="left">
                            <asp:TextBox ClientIDMode="Static" ID="repwd_txtbox" runat="server" Width="230px" TextMode="Password"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">                            
                            <label id="repwdValidatorLbl" class="notifier"></label>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                            Pemission:
                        </td>
                        <td align="left">
                            <asp:DropDownList ClientIDMode="Static" ID="permissionDDL" runat="server" AutoPostBack="true" ontextchanged="permissionDDL_TextChanged" 
                                onselectedindexchanged="permissionDDL_SelectedIndexChanged">
                                <asp:ListItem Value="3"></asp:ListItem>
                                <asp:ListItem Value="2"></asp:ListItem>
                                <asp:ListItem Value="1"></asp:ListItem>
                            </asp:DropDownList>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">
                        </td>
                    </tr>                    
                </table>
            </ContentTemplate>            
        </asp:UpdatePanel>  
        <asp:UpdatePanel ID="updatePanel12" runat="server" UpdateMode="Conditional">
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="permissionDDL" EventName="textchanged" />
            </Triggers>
            <ContentTemplate>
                <table>
                    <tr>
                        <td align="right" width="130px">
                            Real ID:
                        </td>
                        <td align="left">
                            <asp:DropDownList ClientIDMode="Static" ID="realidDDL" runat="server"></asp:DropDownList>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                        </td>
                        <td align="left">
                            <input type="button" id="addBtn" value="Thêm mới" onclick="addNew()" />
                            <%--<asp:Button runat="server" ID="addBtn" ClientIDMode="Static" Text="Thêm mới" OnClientClick="addNew()" />--%>
                        </td>
                        <td>
                            <label id="buttonAddValidator" class="notifier"></label>
                        </td>
                    </tr>
                </table>
            </ContentTemplate>
        </asp:UpdatePanel>      
        </div>
    </div>
    <div class="item">
        <div class="div_head">Chỉnh sửa</div>
        <hr noshade size=4 class="horizon_line" />
        <div class="div_content" id="editDiv" hidden="true">
        <asp:UpdatePanel ID="updataPanel3" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                <table cellpadding="0px" cellspacing="0px">
                    <tr>
                        <td align="right" width="130px">
                            Username: 
                        </td>
                        <td align="left">
                            <asp:TextBox ClientIDMode="Static" ID="username_txtbox2" runat="server" Width="230px" Enabled="false"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">
                            <label id="Label1"></label>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                            Password:
                        </td>
                        <td align="left">
                            <asp:TextBox ClientIDMode="Static" ID="pwd_txtbox2" runat="server" Width="230px" TextMode="Password"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">                    
                            <label id="pwdValidatorLbl2" class="notifier"></label>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                            Retype Password:
                        </td>
                        <td align="left">
                            <asp:TextBox ClientIDMode="Static" ID="repwd_txtbox2" runat="server" Width="230px" TextMode="Password"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">                    
                            <label id="repwdValidatorLbl2" class="notifier"></label>
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                            Pemission:
                        </td>
                        <td align="left">
                            <asp:DropDownList ClientIDMode="Static" ID="permissionDDL2" runat="server"  AutoPostBack="true"
                                ontextchanged="permissionDDL2_TextChanged">
                                <asp:ListItem Value="3"></asp:ListItem>
                                <asp:ListItem Value="2"></asp:ListItem>
                                <asp:ListItem Value="1"></asp:ListItem>
                            </asp:DropDownList>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">
                        </td>
                    </tr>
                </table>
            </ContentTemplate>
        </asp:UpdatePanel>
        <asp:UpdatePanel ID="updatePanel32" runat="server" UpdateMode="Conditional">
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="permissionDDL2" EventName="textchanged" />
            </Triggers>
            <ContentTemplate>
                <table>                    
                    <tr>
                        <td align="right" width="130px">
                            Real ID:
                        </td>
                        <td align="left">
                            <asp:DropDownList ClientIDMode="Static" ID="realidDDL2" runat="server"></asp:DropDownList>
                        </td>
                    </tr>
                    <tr>
                        <td>
                        </td>
                        <td align="left" height="20px">
                        </td>
                    </tr>
                    <tr>
                        <td align="right" width="130px">
                        </td>
                        <td align="left">
                            <input type="button" id="editBtn" value="Xác nhận" onclick="edit()" />
                        </td>
                        <td>
                            <label id="buttonEditValidator" class="notifier"></label>
                        </td>
                    </tr>
                </table>
            </ContentTemplate>
        </asp:UpdatePanel>
        </div>
    </div>
</asp:Content>
